 <template>
 	<view class="container">
 		<swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000" class="banner"
 			:circular="true">
 			<swiper-item v-for="item in bannerList">
 				<view class="swiper-item">
 					<image :src="item">
 					</image>
 				</view>
 			</swiper-item>
 		</swiper>
 		<view class="menu">
 			<view v-for="(item,index) in list" class="item" @click="goMenu(item,index)">
 				<image :src="item.pic" class="pic"></image>
 				<view class="text">{{item.text}}</view>
 			</view>
 		</view>
 	</view>
 </template>

 <script>
 	export default {
 		data() {
 			return {
 				bannerList: [
 					'/static/wy/001.jpg',
 					'/static/wy/002.jpg',
 					'/static/wy/003.jpg'
 				],
 				list: []
 			}
 		},
 		onShow() {},
 		watch: {},
 		onLoad() {
 			// #ifdef  APP
 			// (APP)
 			this.list = [{
 					pic: "/static/wy/baoxiu.png",
 					text: "维修"
 				},
 				{
 					pic: "/static/wy/dwx.png",
 					text: "待维修"
 				},
 				{
 					pic: "/static/wy/baoshi.png",
 					text: "回访"
 				},
 				{
 					pic: "/static/wy/wxcx.png",
 					text: "维修查询"
 				},
 				{
 					pic: "/static/wy/jiaofei.png",
 					text: "物业费查询"
 				},
 				{
 					pic: "/static/wy/mrxc.png",
 					text: "每日巡检"
 				},
 				{
 					pic: "/static/wy/jwxc.png",
 					text: "警卫巡查"
 				}
 			]
 			// #endif
 			// #ifdef H5 || MP-WEIXIN
 			// (H5 || MP-WEIXIN)
 			this.list = [{
 					pic: "/static/wy/baoxiu.png",
 					text: "报修"
 				},
 				{
 					pic: "/static/wy/baoshi.png",
 					text: "报事"
 				},
 				{
 					pic: "/static/wy/jiaofei.png",
 					text: "缴费"
 				},
 				{
 					pic: "/static/wy/personinfo.png",
 					text: "个人信息"
 				}
 			]
 			// #endif
 		},
 		methods: {
 			goMenu(item, index) {
 				var token = uni.getStorageSync("token");
 				if (!token) {
 					uni.clearStorage()
 					return uni.redirectTo({
 						url: "/pages/mine/login"
 					})
 				}
 				// #ifdef APP
 				// （APP）
 				switch (index) {
 					case 0:
 						uni.navigateTo({
 							url: "/pages/home/goRepair/repairList"
 						})
 						break;
 					case 1:
 						uni.navigateTo({
 							url: "/pages/home/dwx/index"
 						})
 						break;
 					case 2:
 						uni.navigateTo({
 							url: "/pages/home/goBack/list"
 						})
 						break;
 					case 3:
 						uni.navigateTo({
 							url: "/pages/home/drywx/index"
 						})
 						break;
 					case 4:
 						uni.navigateTo({
 							url: "/pages/home/drjf/index"
 						})
 						break;
 					case 5:
 						uni.navigateTo({
 							url: "/pages/home/mrxj/index"
 						})
 						break;
 					case 6:
 						uni.navigateTo({
 							url: "/pages/home/jwxc/index"
 						})
 						break;
 					default:
 						break;
 				}
 				// #endif
 				// #ifdef H5 || MP-WEIXIN
 				// (H5 || MP-WEIXIN) 原本的
 				switch (index) {
 					case 0:
 						//维修列表
 						uni.navigateTo({
 							url: "/pages/home/sendRepair/repairList"
 						})
 						break;
 					case 1:
 						//投诉列表
 						uni.navigateTo({
 							url: "/pages/home/toushu/toushuList"
 						})
 						break;
 					case 2:
 						//物业费查询列表
 						uni.navigateTo({
 							url: "/pages/home/jiaofei/index"
 						})
 						break;
 					case 3:
 						// 个人信息
 						uni.navigateTo({
 							url: "/pages/mine/persioninfo"
 						})
 						break;
 					default:
 						break;
 				}
 				// #endif


 			}
 		}
 	}
 </script>

 <style lang="scss" scoped>
 	.container {
 		background: #f3f3f3;
 		height: calc(100vh - 94px)
 	}

 	uni-swiper {
 		height: 180px;
 	}

 	.banner {
 		uni-image {
 			width: 100%;
 			height: 180px;
 		}
 	}

 	.menu {
 		width: 100%;
 		overflow: hidden;

 		.item {
 			width: 40%;
 			border: 2px solid #1296db;
 			border-radius: 10px;
 			margin: 10px calc(5% - 2px);
 			float: left;
 			background-color: #ffffff;



 			// float: left;
 			// width: calc(50% - 1px);
 			// border-bottom: 1px solid #d1d1d1;
 			// border-right: 1px solid #d1d1d1;

 			.pic {
 				width: 50px;
 				height: 50px;
 				display: block;
 				margin: 20px auto;
 			}

 			.text {
 				text-align: center;
 				margin-bottom: 10px;
 				font-size: 30rpx;
 				color: #1296db;
 			}
 		}

 		// .item:nth-child(2n+1) {
 		// 	border-bottom: 1px solid #d1d1d1;
 		// 	border-right: 1px solid #d1d1d1;
 		// }
 	}
 </style>